<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="gl">

	<head>
		<title>cSans - Layout demo</title>

		<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
		<meta http-equiv="Content-Language" content="gl" />
		<meta name="author" content="A navalla suíza - http://anavallasuiza.com" />

		<link rel="stylesheet" href="../csans/csans.css" type="text/css" />
		<link rel="stylesheet" href="../csans/grid-950-24-10/css/csans-grid-950-24-10.css" type="text/css" />

		<style type="text/css">
			.row div {
				background-color: #000;
				color: #666;
				text-align: center;
			}
			.row div div {
				background-color: #666;
				color: #000;
			}
		</style>
	</head>

	<body>
		<div class="expanded-page grid">
			<div class="row t4 b8">
				<h1 class="col12">cSans layout demo</h1>
				<p class="col12">
					24 columns (30px each)<br />
					Gutter: 10px<br />
					Total width: 950px
				</p>
			</div>
			<div class="row b2">
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
				<div class="col1">col1</div>
			</div>
			<div class="row b2">
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
			</div>
			<div class="row b2">
				<div class="col3">col3</div>
				<div class="col3">col3</div>
				<div class="col3">col3</div>
				<div class="col3 colp05">col3</div>
				<div class="col3">col3</div>
				<div class="col3">col3</div>
				<div class="col3">col3</div>
				<div class="col3">col3</div>
			</div>
			<div class="row b2">
				<div class="col4">col4</div>
				<div class="col4">col4</div>
				<div class="col4">col4</div>
				<div class="col4">col4</div>
				<div class="col4">col4</div>
				<div class="col4">col4</div>
			</div>
			<div class="row b2">
				<div class="col5c">col5c</div>
				<div class="col5c">col5c</div>
				<div class="col5c">col5c</div>
				<div class="col5c">col5c</div>
				<div class="col5c">col5c</div>
			</div>
			<div class="row b2">
				<div class="col6">col6</div>
				<div class="col6">col6</div>
				<div class="col6">col6</div>
				<div class="col6">col6</div>
			</div>
			<div class="row b2">
				<div class="col8">col8</div>
				<div class="col2">col2</div>
				<div class="col2">col2</div>
				<div class="col4">col4</div>
				<div class="col8">col8</div>
			</div>
			<div class="row b2">
				<div class="col6">col6</div>
				<div class="col12">col12</div>
				<div class="col6">col6</div>
			</div>
			<div class="row b2">
				<div class="col8 l8">col8 l4</div>
				<div class="col8">col8</div>
			</div>
			<div class="row b2">
				<div class="col8 r8">col8 l4</div>
				<div class="col8">col8</div>
			</div>
			<div class="row">
				<div class="col16 l8">
					<p>col16 l8</p>
					<div class="col4">col4</div>
					<div class="col12 last">col12 last</div>
				</div>
			</div>
		</div>
	</body>
</html>